<template>
  <el-form :model="form" label-width="100px">
    <el-form-item label="头像" class="is-required">
      <image-input v-model="form.avatar"></image-input>
    </el-form-item>
    <el-form-item label="昵称" class="is-required">
      <el-input v-model="form.nickname"></el-input>
      <p class="app-form-create-hint">账号信息用于登录，系统不允许修改</p>
    </el-form-item>
    <el-form-item label="帐号" class="is-required">
      <el-input v-model="form.account"></el-input>
      <p class="app-form-create-hint">账号信息用于登录，系统不允许修改</p>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" long @click="editUserdata">
        保存
      </el-button>
    </el-form-item>
  </el-form>
</template>
<script setup lang="ts">
import {ref} from "vue"
import guardStore from "@/apps/admin/store/guard"
import store from "@/store/index"
import {editUserDataApi} from "@/apps/admin/api/common";
import bus from "@/units/bus";
import {ElMessage} from "element-plus";
import {useCloseMessageBox} from "@/hooks/DialogMsg"

const gstore = guardStore(store)

/**
 * 修改密码表单
 */
const form = ref({
  nickname: gstore.nickname,
  avatar: gstore.avatar,
  account: gstore.account
})

/**
 * 关闭弹窗
 */
const close = useCloseMessageBox()


/**
 * 确认修改密码
 */
function editUserdata() {
  editUserDataApi({...form.value}).then(result => {
    if (result.code === 200) {
      bus.emit('refresh-login', undefined)
      ElMessage.success(result.msg)
      close()
    }
  })
}
</script>

<style scoped lang="scss">

</style>